<!--
 * @Author: 雷宇航
 * @Date: 2021-07-09 17:24:36
 * @LastEditTime: 2021-08-04 17:08:43
 * @LastEditors: 雷宇航
 * @Description: 
 * @FilePath: \icm-vue\src\views\hifar\business\BusBusinessReimbursementDetailList.vue
-->
<template>
  <!-- table区域-begin -->
  <div class="BusBusinessReimbursementDetailList">
    <a-tabs defaultActiveKey="1">
      <a-tab-pane tab="6、费用" key="1">
        <a-table
          ref="table"
          size="middle"
          :scroll="{ x: true }"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="saleBeforDataSource"
          :loading="loading"
          :pagination="false"
          class="j-table-force-nowrap"
        >
          <template slot="footer" slot-scope="currentPageData">
            <div style="width: 100%; text-align: center">
              总费用：{{ allMonty }} &nbsp;&nbsp;&nbsp; 总次数：{{ allNum }}
              <!-- &nbsp;&nbsp;&nbsp;  -->
              <!-- 平均费用：{{
                Number(allMonty) ? (allMonty / allNum).toFixed(2) : 0
              }} -->
            </div>
          </template>
          <!-- <template slot="bpmStatus_dictText" slot-scope="text, record">
            <BpmStatusTagComponent :record="record" :text="text"></BpmStatusTagComponent>
          </template>
          <template slot="imgSlot" slot-scope="text">
            <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
            <img
              v-else
              :src="getImgView(text)"
              height="25px"
              alt=""
              style="max-width: 80px; font-size: 12px; font-style: italic"
            />
          </template>
          <template slot="fileSlot" slot-scope="text">
            <span v-if="!text" style="font-size: 12px; font-style: italic">无文件</span>
            <a-button v-else :ghost="true" type="primary" icon="download" size="small" @click="downloadFile(text)">
              下载
            </a-button>
          </template> -->
        </a-table>
      </a-tab-pane>
    </a-tabs>
    <!-- <a-row>
      <a-col :span="8">
        <a-card>
          <a-statistic title="总金额（元）" :value="countMoney" />
        </a-card>
      </a-col>
      <a-col :span="8">
        <a-card>
          <a-statistic title="未发（元）" :value="countNotSend" />
        </a-card>
      </a-col>
      <a-col :span="8">
        <a-card>
          <a-statistic title="已发（元）" :value="countAlreadySend" />
        </a-card>
      </a-col>
    </a-row> -->
  </div>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction } from '@api/manage'
// import BpmStatusTagComponent from '@/components/bpm/bpmStatusTagComponent'

export default {
  name: 'BusBusinessReimbursementDetailList',
  // mixins: [JeecgListMixin],
  // components: { BpmStatusTagComponent },
  props: {
    mainId: {
      type: String,
      default: '',
      required: false,
    },
  },
  watch: {
    mainId: {
      immediate: true,
      handler(val) {
        if (!this.mainId) {
        } else {
          this.queryParam['opportunityId'] = val
          this.loadData()
        }
      },
    },
  },
  data() {
    return {
      description: '商机详情-费用详情',
      disableMixinCreated: true,
      loading: false,
      allMonty: '',
      allNum: '',
      countMoney: '',
      countNotSend: '',
      countAlreadySend: '',
      // 表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        // {
        //   title: '报销编号',
        //   align: 'center',
        //   dataIndex: 'code',
        //   scopedSlots: { customRender: 'code' },
        // },
        {
          title: '申请人',
          align: 'center',
          dataIndex: 'createBy',
        },
        {
          title: '总费用(元)',
          align: 'center',
          dataIndex: 'total',
        },
        {
          title: '次数',
          align: 'center',
          dataIndex: 'num',
        },
        // {
        //   title: '平均费用(元)',
        //   align: 'center',
        //   dataIndex: 'unit',
        // },
        // {
        //   title: '申请时间',
        //   align: 'center',
        //   dataIndex: 'createTime',
        // },
        // {
        //   title: '申请人部门',
        //   align: 'center',
        //   dataIndex: 'sysOrgCode_dictText',
        // },
        // {
        //   title: '费用所属',
        //   align: 'center',
        //   dataIndex: 'auditGrade_dictText',
        // },
        // {
        //   title: '报销类别',
        //   align: 'center',
        //   dataIndex: 'type_dictText',
        // },
        // {
        //   title: '总金额',
        //   align: 'right',
        //   dataIndex: 'total',
        // },

        // {
        //   title: '商机名称',
        //   align: 'center',
        //   dataIndex: 'opportunityName',
        // },
        // {
        //   title: '项目简称',
        //   align: 'center',
        //   dataIndex: 'projectName',
        // },
        // {
        //   title: '客户简称',
        //   align: 'center',
        //   dataIndex: 'shortName',
        // },
        // {
        //   title: '已发放',
        //   align: 'center',
        //   dataIndex: 'issue_dictText',
        // },
        // {
        //   title: '审批状态',
        //   align: 'center',
        //   dataIndex: 'bpmStatus_dictText',
        //   scopedSlots: { customRender: 'bpmStatus_dictText' },
        // },
      ],
      url: {
        list: '/oa/oaReimbursement/nonPermissionList',
        sum: '/oa/oaReimbursement/sum',
      },
      saleBeforDataSource: [],
      queryParam: {
        pageNo: -1,
        pageSize: -1,
        bpmStatus: 3,
      },
      // ipagination: {
      //   current: 1,
      //   pageSize: 5,
      //   pageSizeOptions: ['5', '10', '15'],
      //   showTotal: (total, range) => {
      //     return range[0] + '-' + range[1] + ' 共' + total + '条'
      //   },
      //   showQuickJumper: true,
      //   showSizeChanger: true,
      //   total: 0,
      // },
    }
  },
  created() {},
  methods: {
    loadData() {
      var param = Object.assign({}, this.queryParam)
      param.opportunityId = this.mainId
      getAction(this.url.list, param).then((res) => {
        if (res.success) {
          let result = res.result.records
          result = result.reduce((obj, item) => {
            let find = obj.find((v) => v.createBy == item.createBy)
            let o = {
              ...item,
              num: 1,
            }
            find ? ((find.total += item.total), find.num++) : obj.push(o)
            return obj
          }, [])
          let allMonty = 0,
            allNum = 0
          result.forEach((v) => {
            v.unit = (v.total / v.num).toFixed(2)
            v.total = v.total.toFixed(2)
            allMonty += +v.total
            allNum += v.num
          })
          this.allMonty = allMonty.toFixed(2)
          this.allNum = allNum
          result.sort((a, b) => {
            return b.total - a.total
          })
          this.saleBeforDataSource = result
          // this.ipagination.total = res.result.total
          // this.getSum()
        }
      })
    },
    // getSum() {
    //   var params = this.getQueryParams() //查询条件
    //   getAction(this.url.sum, params).then((res) => {
    //     if (res.success) {
    //       this.countMoney = res.result.countMoney.toFixed(2)
    //       this.countNotSend = res.result.countNotSend.toFixed(2)
    //       this.countAlreadySend = res.result.countAlreadySend.toFixed(2)
    //     }
    //   })
    // },
    // handleTableChange(pagination) {
    //   this.ipagination = pagination
    //   this.loadData()
    // },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
<style>
.BusBusinessReimbursementDetailList .ant-table-placeholder {
  padding: 0;
}
.BusBusinessReimbursementDetailList .ant-empty-normal {
  margin: 15px 0;
}
</style>


